<template>
	<view class="container" v-if="loadEnd">
		<circle-list :type="type" :status="1" :circleList="circleList"></circle-list>
		<view class="empty" v-if="circleList.length == 0">
			<image src="/static/empty.png" mode="widthFix"></image>
			<view style="margin-top: 20rpx;">该分类下暂时没有频道~</view>
		</view>
	</view>
</template>

<script>
import circleList from '@/pages/Component/forum/component/circle/circle-list.vue'
import ikz from '@/pages/Common/tools.js'
export default {
	components: {
		circleList,
	},
	data() {
		return {
			loadEnd: false,
			type: 'circle',
			id: '',
			circleList: [],

			page: 1,
			limit: 10,
			hasMore: false,
		}
	},

	onLoad(options) {
		this.loadEnd = false
		this.id = options.id
		uni.setNavigationBarTitle({
			title: options.name,
		})
		this.getCircleCategory()
	},
	methods: {
		// 获取频道分类
		getCircleCategory() {
			let path = '/xyb/posts/posts_circle/category_list'
			let data = {
				id: this.id,
				page: this.page,
				limit: this.limit,
			}
			ikz.request(path, data, res => {
				if (res.statusCode == 200) {
					// console.log(res.data.data)
					let circleList = res.data.data.data
					this.circleList = this.page == 1 ? circleList : [...this.circleList, ...circleList]
					this.hasMore = this.page < res.data.data.count / this.limit ? true : false
					this.emptyName = '关注'
				}
				// console.log(this.circleList);
				this.loadEnd = true
				uni.hideLoading()
				uni.stopPullDownRefresh()
			})
		},
	},
}
</script>

<style lang="scss" scoped>
page {
}

.container {
	.empty {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		height: 100vh;
		color: #999;

		image {
			width: 40%;
		}
	}
}
</style>
